<template>
  <Card>
    黑暗模式未适配：日历、水平模式的sub-menu的hover状态
    <ElDivider />

    <template>
      <el-row class="mb-4">
        <el-button>Default</el-button>
        <el-button type="primary">
          Primary
        </el-button>
        <el-button type="success">
          Success
        </el-button>
        <el-button
          type="info"
        >
          Info
        </el-button>
        <el-button type="warning">
          Warning
        </el-button>
        <el-button type="danger">
          Danger
        </el-button>
        <el-button>中文</el-button>
      </el-row>

      <el-row class="mb-4">
        <el-button plain>
          Plain
        </el-button>
        <el-button
          type="primary"
          plain
        >
          Primary
        </el-button>
        <el-button
          type="success"
          plain
        >
          Success
        </el-button>
        <el-button
          type="info"
          plain
        >
          Info
        </el-button>
        <el-button
          type="warning"
          plain
        >
          Warning
        </el-button>
        <el-button
          type="danger"
          plain
        >
          Danger
        </el-button>
      </el-row>

      <el-row class="mb-4">
        <el-button round>
          Round
        </el-button>
        <el-button
          type="primary"
          round
        >
          Primary
        </el-button>
        <el-button
          type="success"
          round
        >
          Success
        </el-button>
        <el-button
          type="info"
          round
        >
          Info
        </el-button>
        <el-button
          type="warning"
          round
        >
          Warning
        </el-button>
        <el-button
          type="danger"
          round
        >
          Danger
        </el-button>
      </el-row>
    </template>

    <ElDivider />

    <template>
      <el-row class="mb-4">
        <el-button disabled>
          Default
        </el-button>
        <el-button
          type="primary"
          disabled
        >
          Primary
        </el-button>
        <el-button
          type="success"
          disabled
        >
          Success
        </el-button>
        <el-button
          type="info"
          disabled
        >
          Info
        </el-button>
        <el-button
          type="warning"
          disabled
        >
          Warning
        </el-button>
        <el-button
          type="danger"
          disabled
        >
          Danger
        </el-button>
      </el-row>

      <el-row>
        <el-button
          plain
          disabled
        >
          Plain
        </el-button>
        <el-button
          type="primary"
          plain
          disabled
        >
          Primary
        </el-button>
        <el-button
          type="success"
          plain
          disabled
        >
          Success
        </el-button>
        <el-button
          type="info"
          plain
          disabled
        >
          Info
        </el-button>
        <el-button
          type="warning"
          plain
          disabled
        >
          Warning
        </el-button>
        <el-button
          type="danger"
          plain
          disabled
        >
          Danger
        </el-button>
      </el-row>
    </template>
    <ElDivider />
  </Card>
</template>

<script>
export default {
  name: 'CostCenter',
  data () {
    return {

    }
  }
}
</script>

<style lang="scss" scoped>

</style>
